import React, { Component } from 'react'

const GlobalContext = React.createContext() //创建一个最外层的父组件 跨层级传值
class Film extends Component {
    render() {
        return (
            <GlobalContext.Consumer>
                {  //为什么要用箭头函数  因为要接受参数 谁要用公共函数谁就用consumer包裹
                    (value) => {
                        return <div>{value.text + 'context跨层级传值'} </div>
                    }
                }
            </GlobalContext.Consumer>
        )
    }
}

export default class App extends Component {
    render() {
        return (
            <GlobalContext.Provider value={{
                text: '公共属性'
            }}>
                <Film></Film>
            </GlobalContext.Provider>
        )
    }
}


